.zijid_messageList{
	text-align: center;
	position: fixed;
    top: 8px;
    left: 0;
    z-index: 1010;
    width: 100%;
    pointer-events: none;
}
.zijid_message_div{
	/* display: flex;
	flex-direction: row; */
}

.zijid_message_info{
	background-color: #ffffff;
    color: #000000;
}
.zijid_message_error{
	background-color: #e40000;
    color: #fff;
}
.zijid_message_warn{
	background-color: #ffd900;
    color: #000000;
}
.zijid_message_succeed{
	background-color: #00aa33;
    color: #fff;
}
.zijid_message_success{
	background-color: #00aa33;
    color: #fff;
}
.zijid_x_box{
	/* visibility: hidden; */
	display: none;
}
.zijid_message:hover .zijid_x_box,.zijid_message:active .zijid_x_box{
	/* visibility: visible; */
	display: block;
}
.zijid_x_box:active ::after,.zijid_x_box:active ::before{
    background: rgb(255, 0, 0);
}
.zijid_x_box{
    width: 1.5em;
	margin-left: 1em;
}
.zijid_x{
    background: #a1a1a1;
    width: 1em;
    height: 1em;
    border-radius: 1em;
    line-height: 1.5em;
    font-size: 12px;
    font-family: 黑体;
    color: #fff;
	position: relative;
}
.zijid_x::after,.zijid_x::before{
	border-radius: 1px;
	width: 0.5em;
    height: 1px;
    position: absolute;
    top: 50%;
    left: 50%;
	transform: translate(-50%,-50%);
    background: rgb(204, 204, 204);
    content: "";
}
.zijid_x::after{
	transform: translate(-50%,-50%) rotate(-50deg);
}
.zijid_x::before{
	transform: translate(-50%,-50%) rotate(50deg);
}
.zijid_messageList .zijid_message{

    /* display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center; */

    pointer-events: all;
    border-radius: 2px;
    box-shadow: 0 3px 6px -4px #0000001f, 0 6px 16px #00000014, 0 9px 28px 8px #0000000d;
    pointer-events: all;
	margin: 10px;
	animation: zijid_message 0.3s;
	font-size: 12px;
	animation-fill-mode: forwards;
	overflow: hidden;
	width: auto;
	height: 3em;
	line-height: 3em;
	display: inline-block;
	padding: 0 20px;

	display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-basis: max-content;
    width: fit-content;
    margin: 1em auto;
}
.zijid_messageList .zijid_message_stop{
	animation: zijid_message_stop 0.3s;
	animation-fill-mode: forwards;
}

@keyframes zijid_message {
	from{
		transform: translateY(-50%);
	}
	to{
		transform: translateY(0%);
	}
}

@keyframes zijid_message_stop {
	from{
		max-height: 2em;
	}
	to{
		max-height: 0em;
		opacity: 0;
		margin:0 auto;
	}
}
